﻿<%@ Page Language="C#" AutoEventWireup="true" CodeFile="Default.aspx.cs" Inherits="_Default" %>

<!DOCTYPE html>
<html lang="en">
<head runat="server">
    <title>ASP.NET Valitador with Bootstrap Tooltip</title>
    <link rel="stylesheet" href="~/BootStrap/css/bootstrap.min.css" />
    <link rel="stylesheet" href="~/BootStrap/css/bootstrap-theme.min.css" />
    <meta name="author" content="Rafael Willwohl Salgado" />
    
</head>
<body>
    <form id="form1" runat="server">
    <div style="width:90%; margin:5% auto; display:block;" class="container">
        <div class="form-horizontal">
            <span style="display: none">
                <asp:ValidationSummary ID="LoginUserValidationSummary" runat="server" CssClass="text-error"
                    ValidationGroup="LoginUserValidationGroup" />
            </span>
            <fieldset class="">
                <legend>Test</legend>
            </fieldset>
            <div class="control-group">
                <asp:Label ID="UserNameLabel" CssClass="control-label" runat="server" AssociatedControlID="UserName">Email:</asp:Label>
                <div class="controls">
                    <asp:TextBox ID="UserName" type="email" runat="server" CssClass="textEntry"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="UserNameRequired" runat="server" ControlToValidate="UserName"
                        ErrorMessage="Email é requerido." ForeColor="Red" Display="Dynamic" SetFocusOnError="true"
                        ValidationGroup="LoginUserValidationGroup">&nbsp;</asp:RequiredFieldValidator>
                    <asp:RegularExpressionValidator ID="regularExpressionValidator" runat="server" SetFocusOnError="true"
                        ValidationGroup="LoginUserValidationGroup" ControlToValidate="UserName" Display="Dynamic"
                        ErrorMessage="Formato incorreto!" ValidationExpression="^([\w\.\-]+)@([\w\-]+)((\.(\w){2,3})+)$">&nbsp;</asp:RegularExpressionValidator>
                </div>
            </div>
            <div class="control-group">
                <asp:Label ID="PasswordLabel" runat="server" CssClass="control-label" AssociatedControlID="Password">Senha:</asp:Label>
                <div class="controls">
                    <asp:TextBox ID="Password" runat="server" CssClass="passwordEntry" TextMode="Password"></asp:TextBox>
                    <asp:RequiredFieldValidator ID="PasswordRequired" runat="server" ControlToValidate="Password"
                        ErrorMessage="Password is required." Display="Dynamic" SetFocusOnError="true"
                        ValidationGroup="LoginUserValidationGroup">&nbsp;</asp:RequiredFieldValidator>
                </div>
            </div>
            <div class="control-group">
                <div class="controls" style="">
                    <asp:Label ID="Label1" CssClass="checkbox" runat="server" AssociatedControlID="RememberMe">                      
                        Conectar automaticamente </asp:Label>  

                    <asp:CheckBox ID="RememberMe" runat="server" />
                </div>
            </div>
            
            <br />
            <!--Configure the button to call javascript validation funcion like this-->
            <asp:Button ID="LoginButton" CssClass="btn-success" runat="server" 
                CommandName="Login" CausesValidation="false" OnClientClick="return ValidateForm('LoginUserValidationGroup');"
                Text="Entrar" ValidationGroup="LoginUserValidationGroup" 
                onclick="LoginButton_Click" /> 
                <br />
                <br />
               
                <a href="mailto:rafaelwsalgado@gmail.com" title="email autor">rafaelwsalgado@gmail.com</a> 
        </div>
       
    </div>
    <script src="Jquery/jquery-1.11.1.min.js" type="text/javascript"></script>
    <script src="Jquery/attrchange.js" type="text/javascript"></script>
    <script src="BootStrap/js/bootstrap.min.js" type="text/javascript"></script>
    <script src="BootStrap/js/bootstrap-tooltip.js" type="text/javascript"></script>
    <script type="text/javascript">
    
        // validate only the specific ValidationGroup 
        var validationGroup = "";
        function ValidateForm(ValidationGroup, tryAgain) {

            if (!(typeof Page_ClientValidate === 'function'))
                return true;

            if (Page_ClientValidate(ValidationGroup)) {
                //do stuff here on valid
                return true;
            }
            else {
                validationGroup = ValidationGroup;
                if (!tryAgain) {
                    return ValidateForm(ValidationGroup, true);
                }
                return false;
            }
        }
        //each for falidation group
        $('#LoginUserValidationSummary').attrchange({ trackValues: true,
            callback: function (e) {

                if (validationGroup != "LoginUserValidationGroup")
                    return;
                var value = $('#LoginUserValidationSummary').children().children().first().text();

                var controlToShowToltip = $.grep(Page_Validators, function (obj, i) { return obj.validationGroup == "LoginUserValidationGroup" && (obj.errormessage == value ? true : false); });

                $('#' + controlToShowToltip[0].controltovalidate).tooltip({ title: value, placement: 'right', trigger: 'focus', viewport: { selector: 'body', padding: 0} });
                $('#' + controlToShowToltip[0].controltovalidate).focus();
                $('#' + controlToShowToltip[0].controltovalidate).focusout(function () { $('#' + controlToShowToltip[0].controltovalidate).tooltip('destroy'); });
            }
        });

        //bug fix asp.net
        function __doPostBack(eventTarget, eventArgument) {
            if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
                theForm.__EVENTTARGET.value = eventTarget;
                theForm.__EVENTARGUMENT.value = eventArgument;
                theForm.submit();
            } else {
                __doPostBackT(eventTarget, eventArgument);
            }
        }
        //bug fix asp.net
        function __doPostBackT(eventTarget, eventArgument) {
            if (!theForm.onsubmit || (theForm.onsubmit() != false)) {
                theForm.__EVENTTARGET.value = eventTarget;
                theForm.__EVENTARGUMENT.value = eventArgument;
                theForm.submit();
            }
        }
        
        $(document).ready(function () {
            var ale = '<%=OkLogin??""%>';
           
            if (ale)
                window.alert(ale);
        });
    </script>
    </form>
</body>
</html>
